<template>
  <el-input
    v-bind="$attrs"
    v-on="$listeners"
    v-model="currentValue"
    @blur="blur"
  ></el-input>
</template>
<script>
const rules = {
  'positive-integer': {
    rep: /[^0-9]/ig,
    rule: /^[0-9]{1,}$/
  }
}
export default {
  name: 'InputNumber',
  props: {
    value: String | Number,
    numberType: {
      type: String,
      default: 'positive-integer'
    },
    min: Number | String,
    max: Number | String
  },
  data() {
    return {
      currentValue: '',
      rules: {}
    }
  },
  created() {
    this.rules = rules[this.numberType]
    this.currentValue = this.value
  },
  methods: {
    blur(e) {
      this.currentValue = this.currentValue.replace(this.rules.rep, '')
    }
  },
  watch: {
    currentValue(n, o) {
      this.$emit('input', n)
    },
    value(n, o) {
      this.currentValue = n
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
